<link rel="stylesheet" type="text/css" href="../addons/jy_echarts/resource/18/css/default.css?v=1"/> 
<link rel="stylesheet" type="text/css" href="../addons/jy_echarts/resource/18/css/mobile.css?v=8"/>
<style>
#use_template {background:none;padding:0}
.area-inbox-2 li strong {font-size: 10px;}
</style>
   <div id="wrapper" style="color: #fff;overflow-y:hidden;height:calc(100vh - 50px);position: absolute;">
        <h1 style="padding-left:40px">商城可视化大数据</h1>
        <h2><strong>当前数据</strong><sub>Focus on the indicators</sub><b class="logoline"></b><b class="logoline1"></b><b class="logoline2"></b><b class="logoline3"></b><b class="logoline4"></b></h2>
        <!--时间区-->
        <div class="date-timer">
           <p style="line-height:1.2">
               <strong id="H"></strong>
               <strong>:</strong>
               <strong id="M"></strong>
               <strong id="S" class="hide"></strong>
           </p>
           <em id="D"></em>
            <ul>
                <li id="Y"></li>
                <li id="MH"></li>
                <li id="TD"></li>
            </ul>
        </div>
        <div class="big-index-1">
            <ul>
                <li>
                    <b class="animation-1"></b><b class="animation-2"></b><b class="animation-3"></b>
                    <p>总成交额</p>
                    <strong style="font-size:18px">￥{{pagedata.money.all}}</strong>
                </li>
                <li>
                    <b class="animation-1"></b><b class="animation-2"></b><b class="animation-3"></b>
                    <p>总订单数</p>
                    <strong>{{pagedata.order.all}}个</strong>
                </li>
                <li>
                    <b class="animation-1"></b><b class="animation-2"></b><b class="animation-3"></b>
                    <p>总访问量</p>
                    <strong>{{pagedata.access.all}}次</strong>
                </li>
                <li>
                    <b class="animation-1"></b><b class="animation-2"></b><b class="animation-3"></b>
                    <p>今日成交额</p>
                    <strong>￥{{pagedata.money.day || '0.00'}}</strong>
                </li>
                <li>
                    <b class="animation-1"></b><b class="animation-2"></b><b class="animation-3"></b>
                    <p>今日订单数</p>
                    <strong>{{pagedata.order.day}}个</strong>
                </li>
                <li>
                    <b class="animation-1"></b><b class="animation-2"></b><b class="animation-3"></b>
                    <p>今日访问量</p>
                    <strong>{{pagedata.access.day}}次</strong>
                </li>
            </ul>
        </div>
        <div class="submenu">
            <ul>
                <li><a href="#this"><b>{{pagedata.order.day}}</b><span>订单量<em></em></span></a> </li>
                <li><a href="#this" class="active"><b>{{pagedata.money.day || '0.00'}}</b><span>营业额<em></em></span></a> </li>
            </ul>
        </div>
        <div class="center-area">
            <div class="pandect-area">
                <h3>
                    <p>当前08时<sub>8 points</sub></p>
                    <strong>月度营业额</strong>
                    <em> 11时：29.742 Erl</em>
                </h3>
                <span class="pandect-area-left">
                    <b></b>
                </span>
                <div class="pandect-area-center">
                    <div id="arightboxbott" style="height:255px"></div>
                </div>
                <span class="pandect-area-right">
                    <b></b>
                </span>
            </div>
            <div class="details1-area">
                <span class="detailsl-area-left"></span>
                <div class="details1-area-center">
                <h3>今日IP流量数统计</h3>
                <dl>
                    <dt>来访用户数</dt>
                    <dd>
                        
						<ul>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class=""></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li class="green"></li>
                        </ul>
                        {{pagedata.accessip.day}}
                    </dd>
                    <dt>小程序来访用户数</dt>
                    <dd>
                        <ul>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li class="green"></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                        </ul>
                        {{pagedata.accessip.app_day}}
                    </dd>
                    <dt>H5用户来访数 </dt>
                    <dd>
                        <ul>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li class="green"></li>
                            <li class="green"></li>
                            <li></li>
							<li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                        </ul>
                        {{pagedata.accessip.h5_day}}
                    </dd>
                </dl>
                <b></b>
                </div>
                <span class="detailsl-area-right"></span>

            </div>
            <div class="details2-area">
                <span class="details2-area-left"></span>
                <div class="details2-area-center">
                    <h3>今日网络访问次数</h3>
                    <dl>
                        <dt>小程序访问数据</dt>
                        <dd>
                            <ul>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li class="green"></li>
                                <li class="green"></li>
                                <li class="green"></li>
								<li class="green"></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            {{pagedata.access.app_day}}
                        </dd>
                        <dt>手机端访问次数</dt>
                        <dd>
                            <ul>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li class="green"></li>
                                <li class="green"></li>
                                <li class="green"></li>
                                <li class="green"></li>
                                <li class="green"></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                             {{pagedata.access.h5_day}}
                        </dd>
                        <dt>总访问量 </dt>
                        <dd>
                            <ul>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li class=""></li>
                                <li class=""></li>
                                <li class=""></li>
                                <li class="green"></li>
                                <li class="green"></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            {{pagedata.access.day}}
                        </dd>
                    </dl>
                    <b></b>
                </div>
                <span class="details2-area-right"></span>
            </div>
        </div>
        <div class="right-area">
            <h3>今日订单成交率 <b></b></h3>
            <div class="area-inbox-1">
                <dl>
                    <dt>用户成交率</dt>
                    <dd class="font12"><span>{{pagedata.rate.user}}%</span><b></b></dd>
                    <dt class="ml-20">用户下单率</dt>
                    <dd class="font-red ml-20"><span>{{pagedata.rate.userorder}}%</span><b></b></dd>
                    <dt>访问成交率</dt>
                    <dd><span>{{pagedata.rate.access}}%</span><b></b></dd>
                </dl>
                <div class="round-1"></div>
                <div class="round-2"></div>
                <div class="round-3">{{pagedata.rate.order}}%</div>
                <div class="round-4"></div>
            </div>
            <div class="area-inbox-2">
                    <ul>
                        <li><strong>总用户</strong>{{pagedata.rate.all_user}}%<b></b><em></em></li>
                        <li><strong>总访问</strong>{{pagedata.rate.all_order}}%<b></b><em></em></li>
                        <li><strong>总订单</strong>{{pagedata.rate.all_access}}%<b></b><em></em></li>
                    </ul>
                    <div class="area-text">
                        <b class="animation-line1"></b>
                        <h4>数据说明：</h4>
                        <p class="text_container">
                            <script>var s = '（用户成交率、用户下单率、访问成交率，均指ID单次访问的比率数据！'; var con = $('.text_container'); var index = 0; var length = s.length; var tId = null; function start(){ con.text(''); tId=setInterval(function(){ con.append(s.charAt(index)); if(index++ === length){ clearInterval(tId); index = 0; start() } },150); } start();</script>
                        </p>
                        <b class="animation-line2"></b>
                    </div>
            </div>
        </div>
    </div>
<script src="../addons/jy_echarts/resource/js/alldata.js"></script>
<script type="text/javascript">
setTimeout(function(){created();} ,500);
// 时间区
$(document).ready(function(){
    setInterval(showTime, 1000);
    function timer(obj,txt){
        obj.text(txt);
    }
    function showTime(){
        var today = new Date();
        var weekday=new Array(7)
        weekday[0]="星期一"
        weekday[1]="星期二"
        weekday[2]="星期三"
        weekday[3]="星期四"
        weekday[4]="星期五"
        weekday[5]="星期六"
        weekday[6]="星期日"
        var y=today.getFullYear()+"年";
        var month=today.getMonth()+1+"月";
        var td=today.getDate()+"日";
        var d=weekday[today.getDay()-1];
        var h=today.getHours();
        var m=today.getMinutes();
        var s=today.getSeconds();
        if(h<10){
            h="0"+h;
        }
        if(m<10){
            m="0"+m;
        }
        timer($("#Y"),y);
        timer($("#MH"),month);
        timer($("#TD"),td);
        timer($("#D"),d);
        timer($("#H"),h);
        timer($("#M"),m);
        timer($("#S"),s);
    }

})
</script>